<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta charset="UTF-8"/>
    <link rel="stylesheet" type="text/css" href="../easyui/themes/default/easyui.css"/>
    <link rel="stylesheet" type="text/css" href="../easyui/themes/icon.css"/>
    <link rel="stylesheet" type="text/css" href="../easyui/demo/demo.css"/>
    <script type="text/javascript" src="../easyui/jquery.min.js"></script>
    <script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../easyui/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="../js/user.js"></script>
    <script type="text/javascript" src="../js/alert.js"></script>
</head>

<body>
<div class="easyui-layout" data-options="fit:true">
    <!--<div data-options="region:'north'" style="width: 100%;height: 9%">-->
    <!--</div>-->

    <div data-options="region:'center',title:'用户列表'" style="width: 100%;height: 100%">
        <table id="datagrid" class="easyui-datagrid" 
               url="/user/user-list"
               toolbar="#dgtoolbar" pagination="true"
               pageSize="25" pageList="[25,15,10]"
               rownumbers="true"  fit="true" fitColumns="true">
            <thead>
            <tr>
                <th field="ck" checkbox="true"></th>
                <th data-options="field:'workNum',align:'center',width:'15%'">工号</th>
                <th data-options="field:'name',align:'center',width:'15%'">姓名</th>
                <th data-options="field:'sexStr',align:'center',width:'15%'">性别</th>
                <th data-options="field:'age',align:'center',width:'15%'">年龄</th>
                <th data-options="field:'mobile',align:'center',width:'15%'">手机号码</th>
                <th data-options="field:'departmentName',align:'center',width:'15%'">所属部门</th>
            </tr>
            </thead>
        </table>
        <div id="dgtoolbar">
            <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUsers()">添加用户</a>
            <a href="#" class="easyui-linkbutton" iconCls="icon-cut" plain="true" onclick="removeUsers()">删除用户</a>
            <a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="editUsers()">修改信息</a>
        </div>

    </div>
</div>
<!--</div>-->

<div id="modifydg" class="easyui-dialog" style="width:400px;height:380px;padding:10px 20px"
     closed="true" buttons="#modifydg-buttons">
    <div class="ftitle">修改信息</div>
    <form id="fim" method="post">
        <div class="fitem" style="margin: 10px 0">
            <label>姓名:</label>
            <input name="name" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>性别:</label>
            <select class="easyui-combobox" name="sex" id="sex" style="width:173px;">
                <option value="1">男</option>
                <option value="2">女</option>
            </select>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>账号:</label>
            <input name="username" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>密码:</label>
            <input name="password" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>年龄:</label>
            <input name="age" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>电话:</label>
            <input name="mobile" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>部门:</label>
            <input name="departmentName" class="easyui-validatebox" required="true"/>
        </div>
    </form>
</div>
<div id="modifydg-buttons">
    <a href="#" class="easyui-linkbutton" onclick="updateUsers()">保存</a>
    <a href="#" class="easyui-linkbutton" onclick="javascript:$('#modifydg').dialog('close')">取消</a>
</div>

<div id="adddg" class="easyui-dialog" style="width:400px;height:380px;padding:10px 20px"
     closed="true" buttons="#adddg-buttons">
    <div class="ftitle">新增信息</div>
    <form id="fam" method="post">
        <div class="fitem" style="margin: 10px 0">
            <label>姓名:</label>
            <input name="name" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>性别:</label>
            <select class="easyui-combobox" name="sex" id="sex" style="width:173px;">
                <option value="1">男</option>
                <option value="2">女</option>
            </select>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>账号:</label>
            <input name="username" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>密码:</label>
            <input name="password" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>年龄:</label>
            <input name="age" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>电话:</label>
            <input name="mobile" class="easyui-validatebox" required="true"/>
        </div>
        <div class="fitem" style="margin: 10px 0">
            <label>部门:</label>
            <input name="departmentName" class="easyui-validatebox" required="true"/>
        </div>
    </form>
</div>
<div id="adddg-buttons">
    <a href="#" class="easyui-linkbutton" onclick="addUsers()">添加</a>
    <a href="#" class="easyui-linkbutton" onclick="javascript:$('#adddg').dialog('close')">取消</a>
</div>

</body>
</html>